
<template>
  <div class="container" v-if="shoujiban">
    <van-nav-bar title="订单详情" left-text="返回" left-arrow @click-left="onClickLeft" />
    <div class="inside_container">
      <div class="order_container">
        <div class="order_title">订单信息</div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">订单ID</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.order_no}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">订单来源</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.source}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">平台创建时间</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.created_at}}</span>
        </div>
      </div>
      <!-- 用户信息 -->
      <div class="order_container" style="margin-top:15px">
        <div class="order_title">
           用户信息
          <span style="float:right;font-size:14px;color:#2757FF" @click="jiemi(item,1)">查看完整信息</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">证件姓名</span>
          <span style="color:#404247;font-size:14px;width:65%">
            {{order.id_card_name}}
            <span
              style="float:right;font-size:14px;color:#2757FF"
              @click="checkimg(order)"
            >查看证件</span>
          </span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">证件号码</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.id_card_num}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">收件人</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.address_name}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">联系电话</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.address_mobile}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">收货地址</span>
          <span
            style="color:#404247;font-size:14px;width:65%"
          >{{ order.address_province }}{{ order.address_city }}{{ order.address_district }}{{ order.address }}</span>
        </div>
      </div>
      <!-- 订单状态 -->
      <div class="order_container" style="margin-top:15px;padding-bottom:30px">
        <div class="order_title">订单状态</div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">订单状态</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.status_name}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">激活状态</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.active_name}}</span>
        </div>
        <div style="margin-top:30px">
          <div style="color:#787D85;font-size:14px;">备注失败原因</div>
          <div style="color:#404247;font-size:14px;width:100%;margin-top:10px">{{order.reason}}</div>
        </div>
      </div>
      <!-- 生产信息 -->
      <div class="order_container" style="margin-top:15px">
        <div class="order_title">生产信息</div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">生产号码</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.plan_mobile_produce}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">物流公司</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.tracking_company_id}}</span>
        </div>
        <div style="display:flex;margin-top:15px">
          <span style="color:#787D85;font-size:14px;width:35%">物流单号</span>
          <span style="color:#404247;font-size:14px;width:65%">{{order.tracking_number}}</span>
        </div>
      </div>
    </div>
    <div class="footer">
      <div style="font-size:14px;width:30%">
      <el-dropdown
        @command="handleCommand($event,item)"
        trigger="click"
      >
      <span style="color:#333">
         更多
      </span>
      <el-dropdown-menu slot="dropdown">
       <el-dropdown-item command="b">修改照片</el-dropdown-item>
       <el-dropdown-item command="c">重提订单</el-dropdown-item>
       <el-dropdown-item command="d">编辑备注</el-dropdown-item>
       <el-dropdown-item command="e">退款</el-dropdown-item>
       </el-dropdown-menu>
      </el-dropdown>
      </div>
      <div class="footer_right">
        <div class="giveUP" @click="giveup(order.order_id)" v-if="order.status==150 || order.status==-460">放弃订单</div>
        <!-- <div class="giveUP" @click="handleCommand('a')">修改商品</div> -->
        <div class="editOrder" @click="editorderbtn(order)">修改订单</div>
      </div>
    </div>
 <!-- 修改商品 -->
    <el-dialog
      title="修改商品"
      :visible.sync="isshoweditseller"
      :close-on-click-modal="false"
      width="440px"
    >
      <div style="margin-bottom: 20px;">
        <div class="t_change_seller_title">通过商品名称修改</div>
        <el-select
          style="width: 100%;"
          @change="checkchengname"
          :disabled="disablename"
          clearable
          v-model="goods_name"
          filterable
          placeholder="请选择"
        >
          <el-option
            v-for="item in selleroptions"
            :key="item.id"
            :label="item.title"
            :value="item.id"
          ></el-option>
        </el-select>
      </div>
      <div style="margin-bottom: 20px;">
        <div class="t_change_seller_title">通过商品编码修改</div>
        <el-input
          @blur="checkskures"
          @input="checkchengsku"
          :disabled="disablesku"
          v-model="goods_sku"
          placeholder="请输入内容"
        ></el-input>
      </div>
      <div style="margin-bottom: 30px;">
        <div class="t_change_seller_title">查询结果</div>
        <el-input
          :disabled="true"
          resize="none"
          type="textarea"
          rows="5"
          v-model="skucheckres"
          placeholder
        ></el-input>
      </div>
      <div style="text-align: right;">
        <el-button round @click="isshoweditseller = false">取 消</el-button>
        <el-button round type="primary" @click="upeditseller">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 修改订单 -->
    <el-dialog
      title="修改订单信息"
      :visible.sync="isshoweditorder"
      width="560px"
      :close-on-click-modal="false"
    >
      <div>
        <div style="display: flex;" v-if="!shoujiban">
          <div style="margin-bottom: 20px;">
            <div class="t_change_seller_title">收货人</div>
            <el-input
              style="width: 250px;"
              v-model="changeorderinfo.address_name"
              placeholder="请输入收货人名称"
            ></el-input>
          </div>
          <div style="margin-bottom: 20px;margin-left: 20px;">
            <div class="t_change_seller_title">身份证姓名</div>
            <el-input
              style="width: 250px;"
              v-model="changeorderinfo.id_card_name"
              placeholder="请输入身份证姓名"
            ></el-input>
          </div>
        </div>
        <div v-if="shoujiban">
          <div style="margin-bottom: 20px;">
            <div class="t_change_seller_title">收货人</div>
            <el-input
              style="width: 250px;"
              v-model="changeorderinfo.address_name"
              placeholder="请输入收货人名称"
            ></el-input>
          </div>
          <div style="margin-bottom: 20px;">
            <div class="t_change_seller_title">身份证姓名</div>
            <el-input
              style="width: 250px;"
              v-model="changeorderinfo.id_card_name"
              placeholder="请输入身份证姓名"
            ></el-input>
          </div>
        </div>
        <div style="margin-bottom: 20px;">
          <div class="t_change_seller_title">身份证号</div>
          <el-input v-model="changeorderinfo.id_card_num" placeholder="请输入身份证号"></el-input>
        </div>
        <div style="margin-bottom: 20px;">
          <div class="t_change_seller_title">联系电话</div>
          <el-input
            style="width: 250px;"
            v-model="changeorderinfo.address_mobile"
            placeholder="请输入联系电话"
          ></el-input>
        </div>
        <div style="margin-bottom: 20px;">
          <div class="t_change_seller_title" style="display: flex; justify-content: space-between;">
            <div>收货地址</div>
            <div @click="showzdy" style="font-size:12px;color:#AFB3BC;cursor: pointer;">没有找到省市区？手动填写</div>
          </div>
          <el-cascader
            style="width: 100%;margin-bottom: 10px;"
            @change="changeaddress"
            v-model="localcitycode"
            :options="options"
          ></el-cascader>
          <div v-if="isshowzdyshq" style="display: flex;margin-bottom: 10px;">
            <el-input @input="inputaddress" v-model="province_z" placeholder="省"></el-input>
            <el-input
              @input="inputaddress"
              style="margin-left: 10px;margin-right: 10px;"
              v-model="city_z"
              placeholder="市"
            ></el-input>
            <el-input @input="inputaddress" v-model="district_z" placeholder="区"></el-input>
          </div>
          <el-input v-model="changeorderinfo.address" placeholder="请输入收货地址"></el-input>
        </div>
      </div>
      <div style="text-align: right;margin-top: 90px;">
        <el-button round @click="upeditorder(0)">仅保存</el-button>
        <el-button round type="primary" @click="upeditorder(1)">保存并提交至初审</el-button>
      </div>
    </el-dialog>
    <!-- 修改照片 -->
    <el-dialog
      title="身份证照片"
      :center="true"
      :visible.sync="isshoweditimg"
      :close-on-click-modal="false"
      width="1240px"
    >
      <div>
        <div class="t_photo_top">
          <div v-if="checkimgtype==1" style="font-size: 18px;">查看照片</div>
          <div v-if="checkimgtype==2" style="font-size: 18px;">修改照片</div>
          <!-- <el-button type="text">复制订单专属照片上传链接</el-button> -->
        </div>
        <div v-if="checkimgtype==2 && !shoujiban" class="t_img_list_box">
          <div class="t_img_item">
            <chuantu2
              :widths="'380px'"
              :heights="'230px'"
              :bg="'#F6F8FB'"
              :imgs="card_img_1"
              @getimg="getimg1"
              :bgimg="1"
              v-if="relo"
            ></chuantu2>
            <div class="t_img_tips">补充正面照片</div>
          </div>
          <div class="t_img_item">
            <chuantu2
              :widths="'380px'"
              :heights="'230px'"
              :bg="'#F6F8FB'"
              :imgs="card_img_2"
              @getimg="getimg2"
              :bgimg="2"
              v-if="relo"
            ></chuantu2>
            <div class="t_img_tips">补充反面照片</div>
          </div>
          <div class="t_img_item">
            <chuantu2
              :widths="'380px'"
              :heights="'230px'"
              :bg="'#F6F8FB'"
              :imgs="card_img_3"
              @getimg="getimg3"
              :bgimg="3"
              v-if="relo"
            ></chuantu2>
            <div class="t_img_tips">补充免冠照片</div>
          </div>
        </div>
        <div v-if="checkimgtype==2 && shoujiban" style="margin-top: 0.2rem;">
          <div class="t_img_item" style="margin-bottom: 0.2rem;">
            <chuantu2
              :widths="'100%'"
              :heights="'230px'"
              :bg="'#F6F8FB'"
              :imgs="card_img_1"
              @getimg="getimg1"
              :bgimg="1"
              v-if="relo"
            ></chuantu2>
            <div class="t_img_tips">补充正面照片</div>
          </div>
          <div class="t_img_item" style="margin-bottom: 0.2rem;">
            <chuantu2
              :widths="'100%'"
              :heights="'230px'"
              :bg="'#F6F8FB'"
              :imgs="card_img_2"
              @getimg="getimg2"
              :bgimg="2"
              v-if="relo"
            ></chuantu2>
            <div class="t_img_tips">补充反面照片</div>
          </div>
          <div class="t_img_item" style="margin-bottom: 0.2rem;">
            <chuantu2
              :widths="'100%'"
              :heights="'230px'"
              :bg="'#F6F8FB'"
              :imgs="card_img_3"
              @getimg="getimg3"
              :bgimg="3"
              v-if="relo"
            ></chuantu2>
            <div class="t_img_tips">补充免冠照片</div>
          </div>
        </div>
        <div v-if="checkimgtype==1 && !shoujiban" class="t_img_list_box">
          <div class="t_img_item">
            <img v-if="card_img_1" class="t_check_old_img" :src="card_img_1" alt />
            <img v-else class="t_check_old_img" src="@/../static/img/face1.png" alt />
            <div class="t_img_tips">补充正面照片</div>
          </div>
          <div class="t_img_item">
            <img v-if="card_img_2" class="t_check_old_img" :src="card_img_2" alt />
            <img v-else class="t_check_old_img" src="@/../static/img/face2.png" alt />
            <div class="t_img_tips">补充反面照片</div>
          </div>
          <div class="t_img_item">
            <img v-if="card_img_3" class="t_check_old_img" :src="card_img_3" alt />
            <img v-else class="t_check_old_img" src="@/../static/img/face3.png" alt />
            <div class="t_img_tips">补充免冠照片</div>
          </div>
        </div>
        <div v-if="checkimgtype==1 && shoujiban">
          <div class="t_img_item" style="margin-bottom: 0.2rem;">
            <img v-if="card_img_1" class="t_check_old_img" :src="card_img_1" alt />
            <img v-else class="t_check_old_img" src="@/../static/img/face1.png" alt />
            <div class="t_img_tips">补充正面照片</div>
          </div>
          <div class="t_img_item" style="margin-bottom: 0.2rem;">
            <img v-if="card_img_2" class="t_check_old_img" :src="card_img_2" alt />
            <img v-else class="t_check_old_img" src="@/../static/img/face2.png" alt />
            <div class="t_img_tips">补充反面照片</div>
          </div>
          <div class="t_img_item" style="margin-bottom: 0.2rem;">
            <img v-if="card_img_3" class="t_check_old_img" :src="card_img_3" alt />
            <img v-else class="t_check_old_img" src="@/../static/img/face3.png" alt />
            <div class="t_img_tips">补充免冠照片</div>
          </div>
        </div>
      </div>

      <div v-if="checkimgtype==2" style="text-align: center;margin-top: 50px;">
        <el-button round type="primary" @click="upediteimg">保存</el-button>

        <el-button round type="primary" @click="upediteimg(1)">保存并提交至初审</el-button>
      </div>
    </el-dialog>
    <el-dialog
      center
      title="物流详情"
      :visible.sync="wuliuxiangqinglog"
      width="600px"
      :close-on-click-modal="false"
    >
      <div v-if="wuliuxiangqingall.Traces">
        <el-timeline>
          <el-timeline-item
            v-for="(activity, index) in wuliuxiangqingall.Traces"
            :key="index"
            :timestamp="activity.AcceptTime"
          >{{activity.AcceptStation}}</el-timeline-item>
        </el-timeline>
      </div>
      <div v-if="wuliuxiangqingall.Reason">{{wuliuxiangqingall.Reason}}</div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" round @click="wuliuxiangqinglog = false">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="备注" :visible.sync="beizhulog" width="600px" :close-on-click-modal="false">
      <div>
        <fuwenben :content="now.remarks" @getcontent="getcontent" v-if="relo"></fuwenben>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" round @click="baocunbeizhu">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { bufahuodiqu } from "../../assets/bufahuodiqu.js";
import { tongyidizhi } from "../../common/tongyidiqu.js";
import QRCode from "qrcodejs2";
import left from "../left.vue";
import footerApp from '../footerApp.vue'
import fenxiaoshangdingdan from "./fenxiaoshangdingdan.vue"
import top from "../top.vue";
import footers from "../footer.vue";
import chuantu2 from "@/components/chuantu2.vue";
import topandleft from "../topandleft.vue";
import fuwenben from "@/components/fuwenbenclear.vue";
import { regionData, CodeToText, TextToCode } from "element-china-area-data";
export default {
  name: "dingdanchuli",
  components: {
    left,
    top,
    chuantu2,
    topandleft,
    footerApp,
    footers,
    fuwenben,
    fenxiaoshangdingdan
  },
  data() {
    return {
      order: {},
      c5shows: false,
      c5names: "激活开始时间",
      c6shows: false,
      c6names: "激活结束时间",
      c5show: false,
      c5name: "开始时间",
      c6show: false,
      c6name: "结束时间",
      c8name: "交易状态",
      c8show: false,
      timeModal:false,
      isActive:0,
      isOrder: 0,
      orderModal:false,
      activeModal:false,
      activeName: "one",
      ordersVisible: false,
      auto_circulation: 0, //自动流转
      nowtab: 1,
      list: [],
      total: 0,
      search: {
        order_nos:'',
        page: 1,
        page_size: 20,
        source: "",
        status: "",
        goods_name: "",
        goods_sku: "",
        active_status: "",
        order_no: "",
        id_card_num: "",
        address_mobile: "",
        plan_mobile_produce: "",
        tracking_number: "",
        start_time: "",
        end_time: "",
        sort: "desc", //排序  asc  升序 desc 降序
        sort_key: "created_at",
        pay_status: "",
        active_start_time: "",
        active_end_time: "",
        settlement_conditions: "",
        all_round:""
      },
      isshoweditseller: false,
      goods_name: "",
      goods_sku: "",
      skucheckres: "",
      disablename: false,
      disablesku: false,
      isshoweditimg: false,
      checkimgitem: {},
      activeoptions: [],
      orderoptions: [],
      selleroptions: [],
      isshoweditorder: false,
      // options: regionData,//原地址
      // options: tongyidizhi,//统一地址
      options: bufahuodiqu,
      localcitycode: "",
      changeorderinfo: {
        address_name: "",
        id_card_name: "",
        id_card_num: "",
        address_mobile: "",
        address: "",
        address_province: "",
        address_city: "",
        address_district: "",
        order_id: "",
        is_submit: ""
      },
      province_z: "",
      city_z: "",
      district_z: "",
      card_img_1: "",
      card_img_2: "",
      card_img_3: "",
      checkimgtype: null,
      isshowzdyshq: false,
      spid: "",
      wuliuxiangqingall: "",
      wuliuxiangqinglog: false,
      shoujiban: false,
      loading: false,
      finished: false,
      showdate: false,
      whodata: "",
      minDate: new Date(2023, 0, 1),
      selectDate: "",
      pickerOptions: {
        onPick: ({ maxDate, minDate }) => {
          this.selectDate = minDate.getTime();
          if (maxDate) {
            this.selectDate = "";
          }
        },
        disabledDate: time => {
          if (this.selectDate !== "") {
            const one = 62 * 24 * 3600 * 1000;
            const minTime = this.selectDate - one;
            const maxTime = this.selectDate + one;
            return time.getTime() < minTime || time.getTime() > maxTime;
          }
        }
      },
      times: [],
      times2: [],
      now: "",
      beizhulog: false,
      relo: true,
      card_num: 0,
      fail_num: 0,
      refund_num: 0,
      isshowlian: false,
      gongyingshang: "", //供应商
      expandcollapse: [],
      flag: "",
      logjilu: false,
      jiluall: ""
    };
  },
  created() {
    this.getlist();
    //详情接口
    this.getdetailslist()
    //商品列表
    this.getshoplist();
    //激活状态
    this.getactivelist();
    //订单状态
    this.getorderactive();
    this.getzidongliuzhuan();
  },
  mounted() {
    if (window.screen.width < 1080) {
      this.shoujiban = true;
      var h = document.documentElement.clientWidth / 7.5 + "px";
      document.documentElement.style.fontSize = h;

      // this.onLoad()
    } else {
      this.getlist();
    }
  },
  methods: {
     onClickLeft() {
      this.$router.go(-1);
    },
    getdetailslist() {
      const { id } = this.$route.query;
      axios.get(`/own/order/info/get?id=${id}`).then(response => {
        if (response.data.msg.code == 0) {
          this.order = response.data.data;
          console.log("this.order", this.order);
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },

   async searchClick(){
      await this.searchbtn()
      this.ordersVisible = false
          },
    addorder() {
      this.ordersVisible = true;
    },
    //自动流转
    getzidongliuzhuan: function() {
      axios.get("/own/page/system/get").then(response => {
        if (response.data.msg.code == 0) {
          this.auto_circulation = response.data.data.auto_circulation;
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    zidongliuzhuan: function() {
      axios
        .post("/own/page/system/config", {
          auto_circulation: this.auto_circulation
        })
        .then(response => {
          if (response.data.msg.code == 0) {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    //自动流转
    caozuojilu: function(item) {
      axios
        .get("/own/order/record?order_id=" + item.order_id)
        .then(response => {
          if (response.data.msg.code == 0) {
            this.jiluall = response.data.data;
            this.logjilu = true;
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    getcontent: function(item) {
      this.now.remarks = item;
      const fonts = document.getElementsByTagName('font');
      for (let font of fonts) {
          const face = font.getAttribute('face');
          if (face) {
              font.style.setProperty('font-family', `"${face}"`, 'important');
              console.log(`修复字体: ${face}`);
          }
      }
    },
    baocunbeizhu: function() {
      axios
        .post("/own/order/remakes/update", {
          order_id: this.now.order_id,
          remarks: this.now.remarks
        })
        .then(response => {
          if (response.data.msg.code == 0) {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            // this.getlist();
             this.getdetailslist()
            this.beizhulog = false;
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    daochu: function() {
      axios
        .get("/own/my/order/export", { params: this.search })
        .then(response => {
          if (response.data.msg.code == 0) {
            location.href = response.data.data;
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    timechange2: function(val) {
      if (this.times2 == null) {
        this.search.active_start_time = "";
        this.search.active_end_time = "";
      } else {
        this.search.active_start_time = this.times2[0];
        this.search.active_end_time = this.times2[1];
      }
    },
    timechange: function(val) {
      if (this.times == null) {
        this.search.start_time = "";
        this.search.end_time = "";
      } else {
        this.search.start_time = this.times[0];
        this.search.end_time = this.times[1];
      }
    },
    xuanshijianshow: function(val) {
      if (val == 1) {
        this.showdate = true;
        this.whodata = "start_time";
      }
      if (val == 2) {
        this.showdate = true;
        this.whodata = "end_time";
      }
    },
    xuanshijian: function(val) {
      this.search[this.whodata] = moment(val).format("YYYY-MM-DD hh:mm:ss");
      this.showdate = false;
    },
    onLoad() {
      axios.get("/own/my/order", { params: this.search }).then(response => {
        if (response.data.msg.code == 0) {
          if (response.data.data.data.length > 0) {
            response.data.data.data.forEach(item => {
              this.list.push(item);
            });

            if (this.list.length >= response.data.data.total) {
              this.finished = true;
            } else {
              this.search.page++;
              this.loading = false;
            }
          } else {
            this.finished = true;
          }
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    wuliu: function(item) {
      axios
        .post("/api/order/track/query", { order_id: item.order_no })
        .then(response => {
          if (response.data.msg.code == 0) {
            this.wuliuxiangqingall = response.data.data;
            if (this.wuliuxiangqingall && this.wuliuxiangqingall.Traces) {
              this.wuliuxiangqingall.Traces = this.wuliuxiangqingall.Traces.reverse();
            }
            this.wuliuxiangqinglog = true;
          } else {
            if (response.data.msg.code == 444) {
            } else {
              this.$message.error(response.data.msg.info);
            }
          }
        });
    },
    //列表
    getlist() {
      axios.get("/own/my/order", { params: this.search }).then(response => {
        if (response.data.msg.code == 0) {
          console.log("列表");
          console.log(response.data.data);
          this.list = response.data.data.data;
          console.log("this.list233333333", this.list);
          this.total = response.data.data.total;
          this.card_num = response.data.data.card_num;
          this.fail_num = response.data.data.fail_num;
          this.refund_num = response.data.data.refund_num;
          this.expandcollapse = [];
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    //商品列表
    getshoplist() {
      axios.get("/own/page/list?is_all=1").then(response => {
        console.log("999", response);
        if (response.data.msg.code == 0) {
          this.selleroptions = response.data.data.data;
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    //激活状态
    getactivelist() {
      axios.get("/api/order/active_status/list").then(response => {
        if (response.data.msg.code == 0) {
          var arr = [];
          for (let index in response.data.data) {
            // console.log(index)//key
            // console.log(obj[index])//value
            arr.push({ key: index, value: response.data.data[index] });
          }
          this.activeoptions = arr;
          console.log("激活状态");
          console.log(arr);
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    //订单状态
    getorderactive() {
      axios.get("/api/order/status/list").then(response => {
        if (response.data.msg.code == 0) {
          var arr = [];
          for (let index in response.data.data) {
            // console.log(index)//key
            // console.log(obj[index])//value
            arr.push({ key: index, value: response.data.data[index] });
          }
          this.orderoptions = arr;
          console.log("订单状态");
          console.log(arr);
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    //切换tab
    choosetabbtn(i) {
      this.nowtab = i;
      this.search.page = 1;
      if (i == 1) {
        this.search.status = "";
        this.search.pay_status = "";

      }
      if (i == 2) {
        this.search.status = "-200";
        this.search.pay_status = "";

      }
      if (i == 3) {
        this.search.status = "-460";
        this.search.pay_status = "";

      }
      if (i == 4) {
        this.search.status = "";
        this.search.pay_status = "5";

      }

      if (window.screen.width < 1080) {
        this.list = [];
        this.loading = false;
        this.finished = false;
        this.onLoad();
      } else {
        this.getlist();
      }
    },
    //切换排序
    changesort() {
      if (this.search.sort == "asc") {
        this.search.sort = "desc";
        this.getlist();
        return;
      }
      if (this.search.sort == "desc") {
        this.search.sort = "asc";
        this.getlist();
        return;
      }
    },
    //搜索
    searchbtn() {
      this.search.page = 1;
       this.search.order_nos=this.search.order_nos.split(/\n/).join(",");
      if (window.screen.width < 1080) {
        this.list = [];
        this.loading = false;
        this.finished = false;
        this.onLoad();

      } else {
        this.getlist();
      }
    },
    //重置
    resetbtn() {
      this.search.page = 1;
      this.search.source = "";
      this.search.status = "";
      this.search.goods_sku = "";
      this.search.goods_name = "";
      this.search.active_status = "";
      this.search.order_no = "";
      this.search.id_card_num = "";
      this.search.address_mobile = "";
      this.search.plan_mobile_produce = "";
      this.search.tracking_number = "";
      this.search.start_time = "";
      this.search.end_time = "";
      this.search.sort = "asc";
      this.search.pay_status = "";
    },
    //分页
    pagechange(val) {
      console.log(val);
      this.search.page = val;
      //列表
      this.getlist();
    },
    //复制功能
    copy: function(t) {
      var that = this;
      this.$copyText(t).then(res => {
        that.$message.success("复制成功");
      });
    },
    //放弃订单
    giveup(order_id) {
      this.$confirm("是否确认放弃订单?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        customClass: "confirmContainer"
      })
        .then(() => {
          axios
            .post("/own/order/status/set", {
              order_id: order_id,
              status: 0
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                this.$message({
                  type: "success",
                  message: "操作成功!"
                });
                this.getlist();
              } else {
                this.$message.error(response.data.msg.info);
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
    },
    // handleDropdownClick(command, order) {
    //   this.handleCommand(command, order);
    // },
    handleCommand(command, item) {
      if (command == "c") {
        //重提订单
        this.$confirm("是否确认重提订单?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
          customClass: "confirmContainer"
        })
          .then(() => {
            axios
              .post("/own/order/submit", {
                id: this.order.order_id
              })
              .then(response => {
                if (response.data.msg.code == 0) {
                  this.$message({
                    type: "success",
                    message: "操作成功!"
                  });

                  this.getlist();
                } else {
                  this.$message.error(response.data.msg.info);
                }
              });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消"
            });
          });
      }
      if (command == "a") {
        //修改商品
        this.isshoweditseller = true;
        this.checkimgitem = item;
        this.goods_name = "";
        this.goods_sku = "";
        this.spid = "";
        this.disablename = false;
        this.disablesku = false;
        this.skucheckres = "";
      }
      if (command == "b") {

        //修改照片
        // console.log("item.face_url",this.order.face_url);
        this.isshoweditimg = true;
        // this.checkimgitem = item;
        this.card_img_1 = this.order.face_url;
        this.card_img_2 = this.order.back_url;
        this.card_img_3 = this.order.hand_url;
        this.checkimgtype = 2;

        this.relo = false;
        this.$nextTick(() => {
          this.relo = true;
        });
      }
      if (command == "d") {
        //备注
        this.now = {
          order_id: this.order.order_id,
          remarks: this.order.remarks
        };

        this.beizhulog = true;
        this.relo = false;
        this.$nextTick(() => {
          this.relo = true;
        });
      }
      if (command == "e") {
        //是否主动给用户退款？
        this.$confirm("是否主动给用户退款？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
          customClass: "confirmContainer"
        })
          .then(() => {
            axios
              .post("/own/order/refund", {
                order_id: this.order.order_id
              })
              .then(response => {
                if (response.data.msg.code == 0) {
                  this.$message({
                    type: "success",
                    message: "操作成功!"
                  });

                  this.getlist();
                } else {
                  this.$message.error(response.data.msg.info);
                }
              });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消"
            });
          });
      }
    },

    //打开修改订单
    editorderbtn(order) {
      this.jiemi(order, 2);

      this.changeorderinfo.order_id = order.order_id;
      this.isshoweditorder = true;

      this.changeorderinfo.address_province = order.province;
      this.changeorderinfo.address_city = order.city;
      this.changeorderinfo.address_district = order.district;

      this.localcitycode = [
        order.address_province,
        order.address_city,
        order.address_district
      ];
      console.log(this.localcitycode);
      this.changeTextToCode(
        order.address_province,
        order.address_city,
        order.address_district
      );
    },
    //地区文字转编码
    changeTextToCode(province, city, district) {
      var citycode = [];
      try {
        if (province != "") {
          citycode.push(TextToCode[province].code);
        }
        if (city != "") {
          citycode.push(TextToCode[province][city].code);
        }
        if (district != "") {
          citycode.push(TextToCode[province][city][district].code);
        }
        this.localcitycode = citycode;
        this.isshowzdyshq = false;
      } catch (e) {
        //手动
        console.log("没有在组件库找到此地址");
        this.isshowzdyshq = true;
        this.province_z = province;
        this.city_z = city;
        this.district_z = district;
      }

      this.changeorderinfo.address_province = province;
      this.changeorderinfo.address_city = city;
      this.changeorderinfo.address_district = district;
    },
    //选择地址
    changeaddress(val) {
      console.log(val);
      this.province_z = "";
      this.city_z = "";
      this.district_z = "";
      this.changeorderinfo.address_province = this.changeCodeToText(val[0]);
      this.changeorderinfo.address_city = this.changeCodeToText(val[1]);
      this.changeorderinfo.address_district = this.changeCodeToText(val[2]);
    },
    //手动输入地址
    inputaddress() {
      this.localcitycode = [];
      this.changeorderinfo.address_province = this.province_z;
      this.changeorderinfo.address_city = this.city_z;
      this.changeorderinfo.address_district = this.district_z;
    },
    //地区编码转文字
    changeCodeToText(code) {
      return CodeToText[code];
    },
    //修改订单
    upeditorder(type) {
      this.changeorderinfo.is_submit = type;
      console.log(this.changeorderinfo);
      axios.post("/own/order/info/set", this.changeorderinfo).then(response => {
        if (response.data.msg.code == 0) {
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.isshoweditorder = false;
          this.getlist();
        } else {
          this.$message.error(response.data.msg.info);
        }
      });
    },
    //修改照片
    upediteimg(val) {
      let is_submit = "";
      if (val == 1) {
        is_submit = 1;
      }
      axios
        .post("/own/order/picture/set", {
          face_url: this.card_img_1,
          back_url: this.card_img_2,
          hand_url: this.card_img_3,
          order_id: this.order.order_id,
          is_submit: is_submit
        })
        .then(response => {
          if (response.data.msg.code == 0) {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.isshoweditorder = false;
            this.getlist();
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
      this.isshoweditimg = false;
    },
    //查看照片
    checkimg(order) {
      this.checkimgitem = order;
      this.card_img_1 = order.face_url;
      this.card_img_2 = order.back_url;
      this.card_img_3 = order.hand_url;
      this.isshoweditimg = true;
      this.checkimgtype = 1;
    },
    //监听修改名称
    checkchengname() {
      console.log(this.goods_name);
      if (this.goods_name != "") {
        this.disablesku = true;
        this.spid = "";
      } else {
        this.disablesku = false;
      }
    },
    //监听修改编码
    checkchengsku() {
      if (this.goods_sku != "") {
        this.disablename = true;
      } else {
        this.disablename = false;
        this.skucheckres = "";
        this.spid = "";
      }
    },
    //查看编码
    checkskures() {
      if (this.goods_sku != "") {
        axios
          .get("/own/page/list", { params: { fetch_code: this.goods_sku } })
          .then(response => {
            if (response.data.msg.code == 0) {
              console.log("查询商品列表");
              console.log(response);
              if (response.data.data.data.length == 0) {
                this.skucheckres = "未查询到结果";
                this.spid = "";
              } else {
                this.skucheckres =
                  "商品名：" + response.data.data.data[0].title;
                this.spid = response.data.data.data[0].id;
              }
            } else {
              this.$message.error(response.data.msg.info);
            }
          });
      }
    },
    //修改商品
    upeditseller() {
      if (this.goods_name == "" && this.goods_sku == "") {
        this.$message.error("请输入正确信息");
        return;
      }
      if (this.skucheckres == "未查询到结果") {
        this.$message.error("请输入正确信息");
        return;
      }

      var goods_id = "";
      if (this.goods_name) {
        goods_id = this.goods_name;
      } else if (this.spid) {
        goods_id = this.spid;
      }

      axios
        .post("/own/order/goods/set", {
          goods_id: goods_id,
          id: this.order.order_id
        })
        .then(response => {
          if (response.data.msg.code == 0) {
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.isshoweditseller = false;
            this.getlist();
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    //监听返回方法
    getimg1(item) {
      this.card_img_1 = item;
      console.log(item);
    },
    getimg2(item) {
      this.card_img_2 = item;
      console.log(item);
    },
    getimg3(item) {
      this.card_img_3 = item;
      console.log(item);
    },
    //解密
    jiemi(item, type) {
      axios
        .post("/own/order/info/decrypt", { order_id: this.order.order_id })
        .then(response => {
          if (response.data.msg.code == 0) {
            console.log("解密");
            console.log(response);
            if (type == 1) {
              //列表
              this.$set(this.order, "id_card_name", response.data.data.id_card_name);
              this.$set(this.order, "id_card_num", response.data.data.id_card_num);
              this.$set(this.order, "address_name", response.data.data.address_name);
              this.$set(
                this.order,
                "address_mobile",
                response.data.data.address_mobile
              );
              this.$set(this.order, "address", response.data.data.address);
            }
            if (type == 2) {
              //修改
              this.changeorderinfo.address_name =
                response.data.data.address_name;
              this.changeorderinfo.id_card_name =
                response.data.data.id_card_name;
              this.changeorderinfo.id_card_num = response.data.data.id_card_num;
              this.changeorderinfo.address_mobile =
                response.data.data.address_mobile;
              this.changeorderinfo.address = response.data.data.address;
            }
          } else {
            this.$message.error(response.data.msg.info);
          }
        });
    },
    //显示自定义省市区
    showzdy() {
      this.isshowzdyshq = true;
    },
    //同意退款
    agreetui(item, index) {
      // if(item.status==550){
      //   this.isshowlian = true
      // }else{
      this.$confirm("是否确认退款?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          axios
            .post("/own/order/refund", {
              order_id: item.order_id
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                this.$message({
                  type: "success",
                  message: "操作成功!"
                });

                var newitem = item;
                item.isclicktui = true;
                this.$set(this.list, index, newitem);

                // this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消"
          });
        });
      // }
    },
    chaxun(item, index) {
      // console.log('item,index',item,index)
      //第一次点击
      if (!this.expandcollapse.includes(index)) {
        this.expandcollapse.push(index);
      } else {
        this.expandcollapse = this.expandcollapse.filter(item => {
          return item !== index;
        });
      }
    },
    suffixClick() {
      console.log("xsuffixClick");
    }
  }
};
</script>

<style scoped lang="less">

.container {
  width: 100%;
  height: 100%;
  background: #f6f8fb;
  padding-bottom: 100px;
}
/deep/ .van-nav-bar .van-icon {
  color: black;
}
/deep/ .van-nav-bar__text {
  color: black;
}
.order_container {
  width: 100%;
  background: white;
  border-radius: 10px;
  padding: 0 10px;
  padding-bottom: 20px;
}
.inside_container {
  padding: 15px 15px;
}
.order_title {
  width: 100%;
  height: 50px;
  line-height: 50px;
  font-size: 15px;
  border-bottom: 1px solid #f6f8fb;
}
.footer{
  display: flex;
  width: 100%;
  height: 70px;
  background: white;
  position: fixed;
  bottom: 0;
  left: 0;
  align-items: center;
  padding: 0 15px;
}
.footer_right{
  display: flex;
  font-size: 13px;
  width: 70%;
  justify-content: flex-end;
}
.giveUP{
  width: 70px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border-radius: 25px;
  margin-right: 10px;
  color: black;
  background: #F7F8F9;
}
.editOrder{
  width: 70px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border-radius: 25px;
  color: white;
  background: #005AFF;
}
</style>
<style>
.confirmContainer{
  width: 300px !important;
}
</style>
